CSS3 @font-face规则和多列

CSS3 @font-face规则

使用CSS3 @font-face规则，网页设计师再也不必使用计算机安装的字体；网页设计师可以使用任何喜欢的字体。

当你发现需要使用的字体文件时，只需简单的将字体文件包含在网站中，它会自动下载给需要的用户。

你想要的字体就是在CCS3 @font-face规则中定义的。

示例如下：

    <style>
        @font-face{
            font-family:你的自定义字体名称;
            src:url("字体路径");
        }
        /*引用*/
        p{
            font-family:你的自定义字体名称;
        }
    </style>
    <p>我是文字</p>

CSS3多列

通过CSS3，可以创建多个列来对文本进行布局（例如报纸），主要属性如下：

  1. column-count定义分栏的数目；

  2. column-gap定义列与列之间的间隔；

  3. column-rule定义列与列的宽度、样式和颜色规则。

    <style>
        div.column{
            column-count:3;
            column-gap: 50px;
            column-rule: 10px dotted gold;
        }
    </style>
    <div class="column">
        人生就是从烦恼中走过，去寻找人生的智慧，去寻找人生的真谛。假如人身没有烦恼，非常完美，那么那是一场童话；假如人生没有失落，没有失落也就没有希望，人生总是在失落中遥望，遥望有一天能走出苦恼。生活是从误解中收获宽恕，从伤害中收获饶恕，从烦恼中收获智慧，从痛苦中收获善良。
    </div>
    <div class="column">
        人生就是从烦恼中走过，去寻找人生的智慧，去寻找人生的真谛。假如人身没有烦恼，非常完美，那么那是一场童话；假如人生没有失落，没有失落也就没有希望，人生总是在失落中遥望，遥望有一天能走出苦恼。生活是从误解中收获宽恕，从伤害中收获饶恕，从烦恼中收获智慧，从痛苦中收获善良。
    </div>

图片如下：

column多列